<!--
 * @Author: xuxu12138 1718324422@qq.com
 * @Date: 2023-10-19 09:19:16
 * @LastEditors: xuxu12138 1718324422@qq.com
 * @LastEditTime: 2023-11-24 14:26:01
 * @FilePath: /things-admin/src/view/device/Edit/maintenance/Addtenance.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="core" style="margin-top: 100px">
    <Space direction="vertical" size="large">
      <Space style="display: block; margin-top: 20px">
        <span style="display: inline-block; width: 120px"
          ><Icon
            type="ios-medical-outline"
            color="red"
            style="margin-right: 2px"
          />部件名称：</span
        >
        <Input v-model="componentNa" style="width: 400px" />
        <span class="hidden" v-show="!componentNa">部件名称不能为空</span>
      </Space>
      <Space style="display: block; margin-top: 20px">
        <span style="display: inline-block; width: 120px"
          ><Icon
            type="ios-medical-outline"
            color="red"
            style="margin-right: 2px"
          />标识符：</span
        >
        <Input v-model="co" style="width: 400px" />
        <span class="hidden" v-show="!co">code不能为空</span>
      </Space>
      <Space style="display: block; margin-top: 10px">
        <span style="display: inline-block; width: 120px"
          ><Icon
            type="ios-medical-outline"
            color="red"
            style="margin-right: 2px"
          />部件描述：</span
        >
        <Input v-model="descriptio" type="textarea" style="width: 400px" />
        <span class="hidden" v-show="!descriptio">部件描述不能为空</span>
      </Space>
      <Space style="display: block; margin-top: 10px">
        <span style="display: inline-block; width: 120px"
          ><Icon
            type="ios-medical-outline"
            color="red"
            style="margin-right: 2px"
          />部件时长上限：</span
        >
        <Input v-model="usageTi" style="width: 400px" />
        <span class="hidden" v-show="!usageTi">部件使用时长上限不能为空</span>
      </Space>
      <Space style="display: block; margin-top: 10px">
        <span style="display: inline-block; width: 120px"
          ><Icon
            type="ios-medical-outline"
            color="red"
            style="margin-right: 2px"
          />质保时间：</span
        >
        <Input v-model="warran" style="width: 400px" />
        <span class="hidden" v-show="!warran">质保时间不能为空</span>
      </Space>
    </Space>
    <div style="margin-top: 40px">
      <Button style="width: 100px; height: 40px" @click="handleCancel()"
        >返回</Button
      >
      <Button
        style="margin-left: 30px; width: 100px; height: 40px"
        type="primary"
        @click="handleSubmit2('formValidate')"
        >保存
      </Button>
    </div>
  </div>
</template>

<script>
import { putMaintenanceModel } from "@/base/api/MaintenanceModelApi";
export default {
  props: [
    "id",
    "descriptions",
    "componentName",
    "warranty",
    "usageTime",
    "idcope",
    "createTime",
    "updateTime",
    'code'
  ],
  data() {
    return {
      componentNa: this.componentName,
      descriptio: this.descriptions,
      usageTi: this.usageTime,
      warran: this.warranty,
      time: "",
      co:this.code
    };
  },

  watch: {
    warranty(newval) {
      // console.log(newval);
      this.warran = newval;
    },
    usageTime(newval) {
      this.usageTi = newval;
    },
    descriptions(newval) {
      this.descriptio = newval;
    },
    componentName(newval) {
      this.componentNa = newval;
    },
    code(newval){
      this.co = newval
    }
  },
  methods: {
    //返回
    handleCancel() {
      this.$emit("edit", 1, 0);
    },
    getTmie() {
      // 获取当前时间
      var now = new Date();
      // 将时间转化为指定格式的字符串
      var year = now.getFullYear();
      var month = now.getMonth() + 1;
      var day = now.getDate();
      var week = ["日", "一", "二", "三", "四", "五", "六"][now.getDay()];
      var hour = now.getHours();
      // 时分秒个位补零
      if (hour >= 0 && hour < 10) {
        hour = "0" + hour;
      }
      var minute = now.getMinutes();
      if (minute >= 0 && minute < 10) {
        minute = "0" + minute;
      }
      var second = now.getSeconds();
      if (second < 10) {
        second = "0" + second;
      }
      var timeStr =
        year +
        "-" +
        month +
        "-" +
        day +
        " " +
        hour +
        ":" +
        minute +
        ":" +
        second;
      this.time = timeStr;
    },
    //保存接口
    handleSubmit2() {
      this.getTmie();
      if (this.descriptio && this.usageTi && this.warran && this.usageTi) {
        putMaintenanceModel({
          id: this.idcope,
          code: this.co,
          modelId: Number(this.id),
          descriptions: this.descriptio,
          componentName: this.componentNa,
          usageTime: this.usageTi,
          warranty: this.warran,
          created: this.createTime || "",
          updated: this.time,
        }).then((res) => {
          this.$message.success("保存成功");
          this.$emit("edit", 1, 1);
        });
      } else {
        this.$message.error("请将信息填写完整");
      }
    },
  },
};
</script>

<style lang="less" scoped>
.core {
  margin-top: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  .hidden {
    display: block;
    margin-left: 120px;
    font-size: 12px;
    color: red;
  }
}
</style>
